<template lang="html">
    <div class="store-list">
        <myHeader>
            <div class="add-icon">
                <i class="iconfont icon-add" @click="addEventType"></i>
            </div>
        </myHeader>
        <div class="list-title">
            <span>商铺列表</span>
        </div>
        <div class="cell-list-container" v-for="(item, index) in storeList" :key="index">
            <div class="">
                <van-cell-group>
                    <van-cell :title="item.name" is-link :to="`/charge/store/add?id=${item.id}`" />
                </van-cell-group>
            </div>
            <div class="">

            </div>
        </div>
    </div>
</template>

<script>
import Cell from 'vant/lib/cell'
import CellGroup from 'vant/lib/cell-group'
export default {
    data(){
        return {
            storeList: []
        }
    },
    components: {
        vanCell: Cell,
        vanCellGroup: CellGroup
    },
    methods: {
        getList(){
            this.$vux.loading.show({
                text: '加载中'
            })
            this.$api.get('/store/list').then(res => {
                this.$vux.loading.hide()
                this.storeList = res
            })
        },
        addEventType(){
            this.$router.push({
                name: 'chargeStoreAdd'
            })
        }
    },
    created(){
        this.getList()
    }
}
</script>

<style lang="scss" scoped>
    .store-list{
        height: 100%;
        background: rgb(250, 250, 250);
        .list-title{
            padding-left: .15rem;
            line-height: .48rem;
            color: rgba(69,90,100,.6);
            background: #fff;
        }
        .cell-list-container{
            margin-top: .02rem;
        }
    }
</style>
